<template>
  <div class="mod-config">
      <el-form inline v-show="searchShow" ref="searchForm" :model="dataForm" @keyup.enter.native="searchChange()">
        <el-form-item label="姓名" prop="studentName">
          <el-input v-model="dataForm.studentName" placeholder="姓名"></el-input>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="searchChange">查询</el-button>
          <el-button type="default" icon="el-icon-delete" @click="searchReset">清空</el-button>
        </el-form-item>

      </el-form>
      <el-row>
        <el-col :span="24">
          <el-button icon="el-icon-plus" type="primary" @click="addOrUpdateHandle()">新增</el-button>
          <el-button icon="el-icon-search" circle @click="handleSearchShow" style="float:right;"></el-button>
          <el-button icon="el-icon-refresh" circle @click="refreshChange" style="float:right;"></el-button>
        </el-col>
      </el-row>
      <div class="avue-crud">
        <el-table :data="dataList" border v-loading="dataListLoading">
          <el-table-column prop="studentName" label="学生姓名">
            <template slot-scope="scope">
              <div v-if="scope.row.studentName">
                <span><el-button type="text" @click="viewMedicalReport(scope.row.id,scope.row)">{{scope.row.studentName}}</el-button></span>
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="birthDay" label="出生年月"></el-table-column>
          <el-table-column prop="gender" label="性别">
            <template slot-scope="scope">
              <span v-if="scope.row.gender == '0'">男</span>
              <span v-if="scope.row.gender == '1'">女</span>
            </template>
          </el-table-column>
          <el-table-column prop="accountType" label="户口类型">
            <template slot-scope="scope">
              <span v-if="scope.row.accountType == '1'">乡村</span><span v-else>城市</span>
            </template>
          </el-table-column>
          <el-table-column prop="height" label="身高(cm)"></el-table-column>
          <el-table-column prop="weight" label="体重(kg)"></el-table-column>
<!--          <el-table-column prop="bust" label="胸围"></el-table-column>-->
<!--          <el-table-column prop="vitalCapacity" label="肺活量"></el-table-column>-->
<!--          <el-table-column prop="bloodPressureLeft" label="血压左"></el-table-column>-->
<!--          <el-table-column prop="bloodPressureRight" label="血压右"></el-table-column>-->
<!--          <el-table-column prop="pulse" label="脉搏"></el-table-column>-->
<!--          <el-table-column prop="visionLeft" label="视力左"></el-table-column>-->
<!--          <el-table-column prop="visionRight" label="视力右"></el-table-column>-->
<!--          <el-table-column prop="correctVisionLeft" label="矫正视力左"></el-table-column>-->
<!--          <el-table-column prop="correctVisionRight" label="矫正视力右"></el-table-column>-->
<!--          <el-table-column prop="paiLeft" label="排左"></el-table-column>-->
<!--          <el-table-column prop="paiRight" label="排右"></el-table-column>-->
<!--          <el-table-column prop="hearingLeft" label="听力左"></el-table-column>-->
<!--          <el-table-column prop="hearingRight" label="听力右"></el-table-column>-->
<!--          <el-table-column prop="trachoma" label="沙眼"></el-table-column>-->
<!--          <el-table-column prop="colorVision" label="色觉"></el-table-column>-->
<!--          <el-table-column prop="rhinopathy" label="鼻病"></el-table-column>-->
<!--          <el-table-column prop="permanentTeethCariesD" label="恒牙龋齿D"></el-table-column>-->
<!--          <el-table-column prop="permanentTeethCariesM" label="恒牙龋齿M"></el-table-column>-->
<!--          <el-table-column prop="permanentTeethCariesF" label="恒牙龋齿F"></el-table-column>-->
<!--          <el-table-column prop="deciduousToothDecayD" label="乳牙龋齿D"></el-table-column>-->
<!--          <el-table-column prop="deciduousToothDecayM" label="乳牙龋齿M"></el-table-column>-->
<!--          <el-table-column prop="deciduousToothDecayF" label="乳牙龋齿F"></el-table-column>-->
<!--          <el-table-column prop="priodontalDisease" label="牙周疾病"></el-table-column>-->
<!--          <el-table-column prop="heart" label="心"></el-table-column>-->
<!--          <el-table-column prop="lung" label="肺"></el-table-column>-->
<!--          <el-table-column prop="liver" label="肝"></el-table-column>-->
<!--          <el-table-column prop="spleen" label="脾"></el-table-column>-->
<!--          <el-table-column prop="spine" label="脊柱"></el-table-column>-->
<!--          <el-table-column prop="flatFeet" label="平足"></el-table-column>-->
<!--          <el-table-column prop="limbs" label="四肢"></el-table-column>-->
<!--          <el-table-column prop="skin" label="皮肤"></el-table-column>-->
<!--          <el-table-column prop="infectiousDisease" label="传染病"></el-table-column>-->
<!--          <el-table-column prop="chestXRay" label="胸透"></el-table-column>-->
<!--          <el-table-column prop="fecalExamination" label="粪检"></el-table-column>-->
<!--          <el-table-column prop="hemoglobin" label="血色素(血红蛋白)"></el-table-column>-->
<!--          <el-table-column prop="hepatitis" label="肝炎"></el-table-column>-->
<!--          <el-table-column prop="tuberculosis" label="肺结核"></el-table-column>-->
<!--          <el-table-column prop="congenitalHeartDisease" label="先天性心脏病"></el-table-column>-->
<!--          <el-table-column prop="nephritis" label="肾炎"></el-table-column>-->
<!--          <el-table-column prop="rheumatism" label="风湿病"></el-table-column>-->
<!--          <el-table-column prop="alanineAminotransferase" label="谷丙转氨酶"></el-table-column>-->
<!--          <el-table-column prop="totalBilirubin" label="总胆红素"></el-table-column>-->
<!--          <el-table-column prop="otherInformation" label="其他病症"></el-table-column>-->
          <el-table-column prop="heightEvaluation" label="发育评价"></el-table-column>
<!--          <el-table-column prop="weightEvaluation" label="体重评价"></el-table-column>-->
<!--          <el-table-column prop="nutritionalEvaluation" label="营养评价"></el-table-column>-->
          <el-table-column prop="visionEvaluation" label="视力评价"></el-table-column>
          <el-table-column label="操作" width="150px">
            <template slot-scope="scope">
              <el-button type="text" icon="el-icon-collection" @click="viewMedicalReport(scope.row.id,scope.row)">详情</el-button>
              <el-button v-if="permissions.pvm_pvmmedicalreport_edit" type="text" icon="el-icon-edit" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
              <el-button v-if="permissions.pvm_pvmmedicalreport_del" type="text" icon="el-icon-delete" @click="deleteHandle(scope.row.id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <div class="avue-crud__pagination">
        <el-pagination
          @size-change="sizeChangeHandle"
          @current-change="currentChangeHandle"
          :current-page="pageIndex"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="pageSize"
          :total="totalPage"
          background
          layout="total, sizes, prev, pager, next">
        </el-pagination>
      </div>
      <!-- 弹窗, 新增 / 修改 -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></table-form>
      <medical-report v-if="medicalReportVisible" ref="medicalReport" ></medical-report>
  </div>
</template>

<script>
  import {fetchPvmMedicalReportList, delPvmMedicalReportObj} from '@/api/pvm/pvmmedicalreport'
  import TableForm from './pvmmedicalreport-form'
  import MedicalReport from './medicalreportview'
  import {mapGetters} from 'vuex'
  export default {
    data () {
      return {
        dataForm: {
          key: ''
        },
        dataList: [],
        searchShow:true,
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        addOrUpdateVisible: false,
        medicalReportVisible: false
      }
    },
    components: {
      TableForm, MedicalReport
    },
    created () {
      this.getDataList()
    },
    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      // 获取数据列表
      getDataList () {
        this.dataListLoading = true
        fetchPvmMedicalReportList(Object.assign(this.dataForm,{
          current: this.pageIndex,
          size: this.pageSize
        })).then(response => {
          if(response.data.code == '0'){
            this.dataList = response.data.data.records
            this.totalPage = response.data.data.total
          }else{
            this.$message.error(response.data.msg)
          }
          this.dataListLoading = false
        })
      },
      // 每页数
      sizeChangeHandle (val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle (val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 新增 / 修改
      addOrUpdateHandle (id) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id)
        })
      },
      // 删除
      deleteHandle (id) {
        this.$confirm('是否确认删除ID为' + id, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(function () {
          return delPvmMedicalReportObj(id)
        }).then(response => {
          if(response.data.code == '0'){
            this.$message.success('删除成功')
            this.getDataList()
          }else{
            this.$message.error(response.data.msg)
          }
        })
      },
      // 查看体检报告详情
      viewMedicalReport (id,dataList) {
        this.medicalReportVisible = true
        this.$nextTick(() => { this.$refs.medicalReport.init(id,dataList) })
      },
      searchChange() {
        this.pageIndex=1;
        this.getDataList()
      },
      // 搜索清空
      searchReset () {
        this.$refs.searchForm.resetFields();
        this.getDataList(this.page)
      },
      handleSearchShow () {
        this.searchShow = !this.searchShow;
      },
      // 刷新回调
      refreshChange() {
        this.getDataList(this.page)
      }
    }
  }
</script>
